DesignerDraw is a specialized object-oriented drawing program for creating block diagrams, dataflow diagrams, structure charts, flow charts, pert charts, organization charts or any other type of drawing primarily consisting of boxes containing text, with connections between the boxes. Drawing and modifying such diagrams is much quicker and easier than it would be using normal draw or paint programs.
Each box contains a text block which moves with the box when the box is moved to a new location and expands and contracts as the box is resized. The text in a box can consist of a combination of fonts, type styles and text in different point sizes. The text can also be moved relative to the box it is in, and can have its margins and line spacing adjusted.
When the boxes are moved, the connections move with them, and when boxes are resized, the connecting lines are moved appropriately. Connecting lines may be moved to attach to the boxes at any point, and may end in arrowheads, which will automatically point in the right direction. Connectors may be direct or square (consisting of vertical and horizontal lines).
Each box in the drawing may be expanded into a separate window. This feature can be used with structure charts or dataflow diagrams to show a top level design in the main window, with boxes expanding to windows containing diagrams for design at more detailed levels.
There is a set of preset box shapes to choose from. The preset shapes contain the common symbols for structure charts, flow charts, and data flow diagrams, plus several kinds of rectangles and ellipses. Box shapes other than those provided may be used by creating them in an object oriented drawing program (such as MacDraw, MacDraft, or Superpaint in its drawing mode) and importing them via the clipboard.
In addition, pictures may be pasted from the clipboard into the drawing and moved or resized as needed.
Drawings created by DesignerDraw may be exported via the clipboard into more generalized drawing programs for further additions or changes, if desired.
DesignerDraw requires that you have a Macintosh 512K enhanced as a minimum. It will not work on a machine with the old (64K) ROMs, which are found in the 128K and old 512K machines. It also requires the use of system version 4.1 or later, although it is best to use version 4.2 or later (Version 4.2 is the one which comes with MultiFinder.) With version 4.1, there will be some problems with text editing. It will not work with any earlier system versions, as it requires the new routines to handle the enhanced text editing and pop-up menus.
If you are used to using drawing programs like MacDraw, you will notice some differences between the way DesignerDraw and these programs work. These differences are summarized below.
• There are no toolboxes or pallettes on screen. This allows the maximum screen area to be available for drawing. Select different box shapes and annotation symbols from the Shapes menu.
• You are able to switch from text editing to drawing boxes to moving objects all without having to select from a toolbox. A box is selected for text editing by clicking the mouse button while the cursor is inside the box. Clicking or dragging with the mouse inside a box selected for text editing is used for moving the insertion point or selecting text. Clicking and dragging with the mouse outside of a box selected for editing is used for other purposes such as resizing boxes, moving boxes, moving connections, and selecting boxes.
• The Option key is used along with clicking the mouse button to bring up pop up menus. These are menus which appear at the mouse location instead of in the menu bar. Different menus appear depending on whether the cursor is inside a box, pointing at a connector handle, or somewhere else.
Selecting Shapes to Draw
The Shapes menu allows you to select what you want to draw. You can select various box shapes from the Select Shapes… menu item and various symbols from the Annotation Symbols menu item. When Select Shape from the Shapes menu is chosen, a window showing all of the different box shapes available will appear. Point to the one you want and click the mouse, and subsequent boxes will be drawn using the shape you have selected. The same procedure is used to select annotation symbols for drawing. The Text Only Box option in the Shapes menu is used if you want to place text on the diagram, but do not want the text to appear inside a box.
Drawing Objects
After selecting a shape, to draw a box or annotation symbol point the cursor to the place where the upper left-hand corner of the box is to be, hold down the command key, and click the mouse button. This will produce a standard size box. Or, while holding down the mouse button, drag the cursor down and to the right to specify the box or symbol size.
As soon as a box is drawn, a text block is created for it, using the currently selected font, point size, and styles. To enter text, place the cursor in the box and click the mouse button. The box will be selected (indicated by six squares shown surrounding it), and a blinking line will show where text will be entered.
Any text that is typed will be placed in the box. Fonts, alignment, point sizes, and typestyles by selecting the appropriate items from the Style menu. Alignment (left, center, or right) applies to the whole text block, while different fonts, sizes, etc. may be applied to selected portions of the text. The margins, text position and line spacing can also be changed. The section on editing text explains how to do this.
More than one box may be selected at a time. To select multiple boxes, hold down the shift key while moving the cursor into the boxes to be selected and clicking the mouse button, or press the mouse button down while the cursor is outside of all boxes and drag the mouse to draw a rectangle enclosing all of the boxes to be selected. Select All in the Edit menu can be used to select all boxes at once. Selecting several boxes is useful in order to move them as a group to a new location or to delete them all at once.
Holding down the shift key while clicking in a box acts as a toggle, alternately selecting and deselecting the box, while not affecting other selected boxes.
Although several boxes may be selected simultaneously, only one box can be currently selected for text editing. This box will have the blinking text entry line, and the cursor will change from the normal arrow to a bar cursor when inside this box. Clicking in a box which is already selected but is not the one selected for editing will cause that box to become the one selected for editing while leaving any other selected boxes still selected.
When drawing a new box, connecting lines will be drawn from all selected boxes to the new box. The points where the connecting lines originate and end depend on the relative positions of the boxes. If you don't like where the connecting lines are drawn initially, they can be moved. You can also draw additional connecting lines to other boxes after the new box has already been drawn. Instructions for moving and drawing connectors are presented later.
There are three more options for box shapes in the Shape menu - Connecting Box, Import shape from clipboard and Imported Shapes. A connecting box is a small box containing no text whose purpose is to allow lines to end at places other than standard boxes. They can be used to draw lines in segments rather than directly between boxes, and can be used to draw lines which do not appear to be connected to any boxes. (Connecting boxes can also be created by the split connection option (explained later) which allows a connecting line to be split into two lines with a connecting box in between.)
Import shape from clipboard is used to bring in a box shape which was created in another program, such as MacDraw or Superpaint. You may want to do this if none of the predefined box shapes is suitable for your purposes. The current shape is set to the contents of the clipboard and all subsequent boxes will have this shape until a new shape is selected.
Box shapes to be imported should be created using a drawing program rather than a paint program. Paint programs create bit-mapped pictures which will obscure any text which is entered in to them. When creating a box with a drawing program, be sure to specify that no fill pattern is to be used. Otherwise, the fill pattern will obscure any text entered into the box.
Imported Shapes presents a selection box containing shapes which have been imported via the clipboard. This is used just like the selection box for the predefined shapes. This menu item is dimmed if no shapes have been imported.
Moving and Resizing Boxes
To move a box, place the cursor inside the box, press the mouse button, and drag the box with the mouse to wherever you want it. The box which is currently selected for text editing can't be moved by itself, since dragging the mouse inside it is used to select text for editing. If the box you want to move is the one selected for editing, first click the mouse outside of the box to deselect it, and then drag it. All connections to the box will move along with the box and will remain attached at the same points. To move a group of boxes, select all of them, as described previously, point at one of them and drag it to a new location. All of the selected boxes will move together, maintaining the same relative positions to each other.
To resize a box, first select it and then point the cursor at the small black square outside the bottom right-hand corner of the box, and drag the mouse to resize the box. All connectors will be moved to connect at the same relative position on the resized box that they did on the original one.
Editing Text
Text editing works as it does in MacWrite and most other word processors. To add text, place the cursor between the letters where the text is to be added, click the mouse, and begin typing. To delete text, place the cursor before the first letter to be deleted, press the button, and drag the mouse past the last letter to be deleted. The text in between will be highlighted. Then select Cut from the Edit menu. To paste the text back in, move the cursor where the text is to go, click the mouse button, and select Paste from the Edit menu. Copy can be used just like Cut, except that it doesn't delete the text. It can still be pasted elsewhere after being copied. To change the font, size, or style of text, select the text as for cutting or copying and select the appropriate font from the Font menu or size or style from the Style menu.
Cutting and Pasting
The Cut, Copy and Paste menu selections perform several different tasks, depending on the current situation. Following is a description of what they do.
Cut:
• If a box is selected for text editing and a range of text has been selected, the text is deleted and placed in the clipboard.
• If no text is selected to be cut, any selected boxes are deleted.
When the boxes are deleted, they are saved so that they can be pasted back in with a Paste operation. In addition, a picture of the deleted boxes (with the connections drawn between them) is copied to the clipboard. This picture can be pasted into other programs, such as word processors or drawing programs.
Copy:
• The Copy menu selection copies boxes or text to the clipboard just like Cut, except that the boxes or text are not deleted.
Paste:
• If a box is selected for editing and text is present in the clipboard, the text is pasted in at the text insertion point.
• If no box is selected for editing or there is no text in the clipboard and deleted boxes are present in the clipboard, they are pasted in.
• If neither text nor deleted boxes are present, but a picture is present, it is pasted in. The ability to paste pictures is intended to be used for importing illustrations from drawing or painting programs to be included in the final drawing. This is different from importing box shapes from a drawing program. Pictures are pasted in at their original size, whereas box shapes imported via the Import Shape from Clipboard option are drawn at the current box size. Pictures may be moved and resized, just as boxes can, but they have no text block associated with them, and cannot have child windows.
Note:
Pasting boxes back into the diagram only works while the program is still active. If you cut boxes, quit the program, run it again and then try to paste, nothing will be pasted in. Pictures and text, however, remain in the clipboard after the program quits. Therefore you can cut or copy text or pictures and paste them into other programs or into the scrapbook.
Moving Connections
The connecting lines can be adjusted to connect to the boxes at different points from where the were originally placed. To move a connector, first select Show handles on connecting lines from the Options menu. Each connecting line will then be shown with two small black squares on it.
To move a connector, point the cursor at one of the squares (called a "handle") and drag with the mouse. The end of the connector nearest the handle being pointed to will move, while the other end will remain anchored in place. When connectors with arrowheads are moved, the arrowheads are automatically adjusted to point towards the box to which the line is connected.
More Options with Connecting Lines
Holding down the option key when clicking on a connector handle will cause a pop-up menu to appear. Select one of the choices just as you would with a regular menu.
The Split Connection option allows the connecting line to be split into two segments. At the point where the connector handle was, an invisible connecting box is created. This box can be dragged around to cause the connector break to appear in any desired place. This is the same kind of connecting box which is created when boxes are drawn using the Connecting box menu selection.
The Add arrowhead option will draw an arrowhead at the end of the line nearest the handle on which the mouse was clicked. This arrowhead will point in the proper direction to face the box to which the connector is attached. The Remove arrowhead option is used to remove an arrowhead at the end of the line nearest the handle on which the mouse was clicked. (Note: if you want arrowheads all or most of the time, it is easier to select the appropriate default arrowhead option from the Options menu rather than draw one individually every time.)
The Delete connection option is used to delete the connecting line at which the cursor is pointing.
More Options with Boxes
Holding down the option key when clicking on a box will cause a pop-up menu to appear. Select one of the choices just as you would with a regular menu.
The Draw/Remove connecting line option will draw a line from all selected boxes to the current box.
The Change box shape option brings up the window with the predefined box shapes. You can pick one and the current box will change to this shape. The default shape for drawing future boxes does not change as a result of this. This option can't be used to change a box to an imported shape, since it only brings up the window with the predefined shapes.
The Use this box type as default option is used if you want to draw more boxes with the same as this one. It sets the default box shape and size to the current one for future drawing.
The Adjust Text option is used to move the text inside the box. Normally, the text is placed in a rectangle slightly smaller than the box, and word wrapping, centering, etc is done within this rectangle. However, if the box is not rectangular, the text may overlap the edges or otherwise not appear right. This option can be used to correct these problems. Once the option is selected, the cursor shape will change to one showing four arrows, and moving the mouse will move the text rectangle in the same direction as the mouse movement until the button is clicked.
If the option key is pressed while moving the mouse, horizontal movement of the mouse adjusts the text margins while vertical movement adjusts the spacing between the lines of text. Moving to the right will make the text margins wider, and moving to the left will make them narrower. Moving up will make the lines move closer together and moving down will make them further apart. If no adjustment is ever made to line spacing, it will be set depending on the particular fonts, styles, and sizes used. Different lines may be spaced at different intervals depending on what they contain. After line spacing adjustment, however, all lines will be equally spaced.
Open Child Window is used to open a window in which another diagram can be created. If no child window currently exists for the box on which this option is selected, a new window is created containing a copy of the box for which the child window was opened. Typically, such a window would be used for a dataflow diagram or structure chart to show a more detailed level of design than was shown in the main diagram. For example, when drawing a structure chart, the main window could be used to show the top level design while the child windows could show detailed level design. Boxes inside child windows may themselves have child windows.
If this option is selected and the box already has had a child window created, the window is opened, or brought to the front if it is already open.
Find Parent causes the window containing the parent box of the currently selected box to be brought to the front of all other windows.
Note that child windows can be opened and closed at any time, but closing the main window causes all currently open windows to be closed.
Menu Descriptions
Apple Menu: This menu contains the standard About... box and desk accessories.
File Menu: This menu contains standard Mac things like New, Open, Print, Page Setup, and Print. These work as in most other applications and are not explained here, except to note that when the Print option is selected, if more than one window is currently open, the Print option prints the diagram show in the topmost window.
Edit Menu: Contains standard Mac things like Cut, Copy, Paste, and Select All. It also contains Align Horizontal and Align Vertical, which are used to line up all selected boxes. All selected boxes are lined up in the appropriate direction with the box which is currently selected for text editing.
Shapes Menu: All items in this menu have been explained previously.
Fonts Menu: this menu is used to select the font to be used, as in most Macintosh applications. It shows a list of all currently available fonts. If a box is selected for editing and a text range has been selected when a font is selected from this menu, the selected text will change to the new font. If a box is selected for editing, but no text is selected, any text typed at the current insertion point after selecting a new font will appear in the new font. If no box is selected for editing when a font is selected, the selected font becomes the default font for future boxes. (Note that the initial font for a box is established when the box is drawn, not when the first text is entered. Therefore selecting a new default font will not affect any existing boxes even if no text has been entered into them.)
Style Menu: this menu contains the standard text style options (Bold, Italic, etc.), the justification options, and a selection of point sizes. When text is selected, picking a style such as Bold or Underline, will change the text to that style. To remove a style it is necessary to select Plain Text first and then apply any styles which are wanted.
Options Menu: this menu contains various available options.
Show handles on connectors is used to display the connector handles so that the connectors can be moved. It applies only to the display on the screen, and does not affect printing.
Change default box sizes, if set, causes the default box size to change every time a box is resized. If not set, resizing a box has no effect on the size of subsequent boxes.
The arrowheads on connectors options are used to set defaults for drawing arrowheads on connectors. 'From' arrowheads causes arrowheads to be drawn on the connectors at the box the connection originates from, while 'To' arrowheads causes arrowheads to be drawn on the connectors at the box the connection goes to. When drawing a new box, the connectors originate at the selected boxes and go to the new box. When drawing a connector between existing boxes, the connectors originate at the selected boxes and go to the box at which the cursor was in when the mouse button was clicked.
Show invisible boxes is used to show a grey outline around invisible boxes (connecting boxes and text-only boxes). This is useful if you create one of these and then can't find it.
The square connectors option is used as follows. If Square connectors is not checked (the default case), connecting lines are drawn as straight lines directly between boxes. If Square connectors is set, connecting lines are drawn as a series of two or three horizontal and vertical lines.
The Drawing Size option is used to specify the number of pages in the drawing. A dialog box will appear which allows a drawing size to be specified of up to six pages wide by three pages long. command key while clicking the mouse button to draw the connecting box. Since connecting lines are automatically drawn from selected boxes to new boxes, the line will be drawn when the connecting box is created. If the connecting box didn't end up exactly where it was supposed to be, it can be dragged to a new location just like any other box.
Ordering Information
DesignerDraw is available from:
Paul M. Hyman
417 Associated Rd.
Suite A-197
Brea, CA 92621
Prices are $55 for the program with documentation on disk in MacWrite format, and $75 for the program with the final printed documentation (available approximately 4/88). Owners of previous versions of the program can upgrade to the new version for $10, but should be aware that the document formats are incompatible - version 3.0 can not read files created by the earlier versions.
